<%@ page language="java" errorPage="/error.jsp" pageEncoding="UTF-8" contentType="text/html;charset=utf-8" %>
<%@ include file="/common/taglibs.jsp" %>
<!DOCTYPE html>
<html>
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<head>
    <meta charset="utf-8"/>
    <title>商品评价</title>
    <%@ include file="/common/styles.jsp" %>
</head>
<body>


<div class="pg-productcomment f-fs2">

    <div class="m-commentbox">
        <%--<div class="m-tags">--%>
        <%--<a href="">服务不错(212)</a>--%>
        <%--<a href="">质量很好(212)</a>--%>
        <%--<a href="">味道很好(212)</a>--%>
        <%--<a href="">质量很好(212)</a>--%>
        <%--<a href="">味道很好(212)</a>--%>
        <%--</div>--%>

        <s:action name="product-comment!search" executeResult="false" namespace="" var="productCommentList">
            <s:param name="query.order">addTime</s:param>
            <s:param name="query.desc">true</s:param>
            <s:param name="query.productId">${param.id}</s:param>
            <s:param name="query.enabled">true</s:param>
            <s:param name="query.pagesize">10</s:param>
        </s:action>

        <c:if test="${empty productCommentList.productComments}">
            <div class="m-nothing">
                <i class="iconfont icon-information"></i>
                <p>没有评价哦</p>
            </div>
        </c:if>

        <c:if test="${!empty productCommentList.productComments}">
        <div class="m-commlist">
            <s:iterator value="%{#productCommentList.productComments}" var="productComment" status="rowStatus">
                <div class="u-item">
                    <div class="u-ath">
                        <img src="${productComment.user.photo}!icon.jpg">
                        <span class="name">${productComment.user.nickname}</span>
                        <span class="data"><s:date name="%{#productComment.addTime}"
                                                   format="yyyy-MM-dd"/></span>
                    </div>
                    <div class="u-text">
                        <p class="info">${productComment.content}</p>
                        <div class="imgs f-cb">
                            <c:if test="${productComment.imgs!=null && productComment.imgs!=''}">
                                <c:set var="productImgs" value="${fn:split(productComment.imgs, ',')}"></c:set>
                                <c:if test="${fn:length(productImgs)>0}">
                                    <c:forEach var="im" items="${productImgs}" varStatus="status" end="10">
                                        <%--<img src="${im}!icon.jpg">--%>
                                        <span  onclick="openImg('${im}')" style="background-image:url('${im}!icon.jpg')"></span>
                                    </c:forEach>
                                </c:if>
                            </c:if>
                        </div>
                        <p class="size">数量：${productComment.orderItem.quantity}</p>
                    </div>
                </div>

            </s:iterator>
            <div class="btn-more" page="2" allpage="${page.totalPage}" id="more"><c:if test="${page.totalPage>1}">加载更多</c:if><c:if test="${page.totalPage<=1}">没有更多了</c:if></div>

        </div>
        </c:if>
    </div>
</div>

<%@ include file="/common/scripts.jsp" %>

<script>
    function openImg(url) {
        var _htm = '<img style="width:100%;" src="'+ url +'"/>'
        layer.open({
            style: 'background:none',
            content:_htm
        })
    }

    $(window).bind("scroll", function () {
        if ($(document).scrollTop() + $(window).height() > $(document).height() - 5 && allpage != 0) {
            var page = $("#more").attr("page");//第一次获取
            var allpage = $("#more").attr("allpage")//总页数

            if (page < (allpage+1)) {
                var _url = yezhu.ctx + "/ajax/productComment/index.jsp";
                $.ajax({
                    url: _url,
                    type: "get",
                    async: false,  //同步
                    data: {
                        "query.begin": page,
                        "query.productId": '${param.id}'
                    },
                    dataType: "html",
                    success: function (result) {

                        $('#more').text("加载中...");
                        $("#more").before(result);//ajax获取html数据
                        page = page * 1 + 1;
                        $("#more").attr("page", page);//设置下次获取page页码
                    }
                });
            } else {
                $('#more').text("没有更多了");//没有更多了
            }
        }
    });

</script>

</body>

</html>
